<template>
  <table id="printMe">
    <tr>
      <td colspan="2">整改单</td>
    </tr>
    <tr>
      <td>所属检验单</td>
      <td>{{ obj.inspectionInfo ? obj.inspectionInfo.serialNumber : "" }}</td>
    </tr>
    <tr>
      <td>序号</td>
      <td>整改内容</td>
    </tr>
    <tr v-for="(item, index) in obj.dictionaryList" :key="index">
      <td>{{ index+1 }}</td>
      <td>{{ item.name }}</td>
    </tr>
    <tr>
      <td>整改人员</td>
      <td>{{ obj.rectificationUserInfo ? obj.rectificationUserInfo.username : "" }}</td>
    </tr>
    <template v-if="obj.rectificationStatus === 2">
      <tr>
        <td>整改结果</td>
        <td>{{ obj.result }}</td>
      </tr>
      <tr>
        <td>整改图片</td>
        <td>
          <template v-if="obj.image">
            <el-image v-for="(img, i) in obj.image.split(';')" v-if="img!= ''" :key="i" class="image" fit="cover"
              alt="点击查看大图" :src="img | imgPath" :preview-src-list="getSrcList(obj.image)" />
          </template>
        </td>
      </tr>
    </template>
  </table>
</template>

<script>
  import {
    imgPath
  } from '@/filters'
  export default {
    data() {
      return {
        obj: {
          inspectionInfo: {},
          dictionaryList: [],
          rectificationUserInfo: {}
        }
      }
    },
    methods: {
      getSrcList(str) {
        let arr = []
        if (str) {
          arr = str.split(';')
        }
        return arr.map(item => imgPath(item))
      }
    }
  }
</script>

<style lang="less" scoped>
  table {
    border-collapse: collapse;
    width: 100%;
    border: 1px solid;
    text-align: center;

    td {
      line-height: 18px;
      border: 1px solid;
      padding: 10px;
      font-size: 14px;
    }

    td:nth-child(odd) {
      width: 20%;
    }
  }

  .image {
    width: 100px;
    height: 100px;
  }
</style>